<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title></title>
    <script type="text/javascript" src="js/jquery-1.11.0.js" ></script>
</head>
<body>
	<div class="course">
		
	</div>
</body>
	<script type="text/javascript">
	$(document).ready(function(){
		$.ajax({
			type:"post",
			url:"http://localhost/future/home/",
			async:true,
			dataType:"jsonp",
			jsonpCallback:"t",
			success:function(response){
				//console.log(response.course)
				
				for (var i = 0 ;i<response.course.length;i++) {
					var cour = $("<a href=''>"+response.course[i].course_name+"</a>");
					$(".course").append(cour);
				}
			}
		});
	});
//		$(document).ready(function(){
//			$.ajax({
//				type:"get",
//				url:"http://localhost/future/home/",
//				async:true,
//				dataType:"jsonp",
//				jsonpCallback:"t",
//				success:function(response,status,xhr){
//					console.log(response.course);	
//				}
//			});
//		});
	</script>
</html>